<template>
	<view>
		<u-tabbar :value="current" @change="chbartab" :fixed="true" :placeholder="true" :safeAreaInsetBottom="true">
			<u-tabbar-item v-for="(item,index) in list" :key="index" :text="item.text" :icon="item.iconPath">
				<view v-if="index==0" slot="active-icon">
					<image style="width: 1rem;height: 1rem;" class="u-page__item__slot-icon"
						src="/static/tabBar/home.png"></image>
				</view>
				<view class="" v-if="index==0" slot="inactive-icon">
					<image style="width: 1rem;height: 1rem;" class="u-page__item__slot-icon"
						src="/static/tabBar/home-1.png"></image>
				</view>
				<view v-if="index==1" slot="active-icon">

					<image class="imas u-page__item__slot-icon" src="/static/tabBar/center.png"></image>
					<view style="height: 1.6rem;">
					</view>
					<view style="color: rgb(25, 137, 250);margin: 0rem auto;font-size: 25rpx;text-align: center;"
						v-if="index==1">预约
					</view>


				</view>
				<view class="" v-if="index==1" slot="inactive-icon">
					<image v-if="index==1" class="imas u-page__item__slot-icon" src="/static/tabBar/center.png"></image>
					<view style="height: 1.6rem;">

					</view>

					<view style="color: rgb(125, 126, 128);margin: 0rem auto;font-size: 25rpx;text-align: center;"
						v-if="index==1">预约
					</view>
				</view>
				
				<view v-if="index==2" slot="active-icon">
					<image style="width: 1.3rem;height: 1.3rem;" class="u-page__item__slot-icon"
						src="/static/tabBar/me.png"></image>
				</view>
				<view class="" v-if="index==2" slot="inactive-icon">
					<image style="width: 1.1rem;height: 1.1rem;" class="u-page__item__slot-icon"
						src="/static/tabBar/me-1.png"></image>
				</view>
			</u-tabbar-item>
		</u-tabbar>
	</view>
</template>

<script>
	export default {
		name: "tabBar",
		props: {
			current: {
				type: Number,
				default: 0 // 设置一个默认值，如果需要
			}
		},
		data() {
			return {
				iconPath: '',
				list: [{
						pagePath: '/pages/tabBar/home/index',
						icon: "home",
						iconPath: '',
						selectedIconPath: '/static/tabBar/home.png',
						text: '首页',
					},

					{
						pagePath: '/pages/tabBar/yuyue/yuyue',
						icon: "",
						iconPath: '',
						selectedIconPath: '/static/tabBar/center.png',
						text: '',

					},
					{
						pagePath: '/pages/tabBar/my/index',
						icon: "",
						iconPath: '',
						selectedIconPath: '/static/tabBar/me.png',
						text: '我的',
					}
				]
			}
		},
		mounted() {
			uni.hideTabBar()
		},
		methods: {
			chbartab(e) {
				console.log(this.list[e].pagePath);
				uni.switchTab({
					url: this.list[e].pagePath
				});
			},
		}
	}
</script>

<style lang="scss" scoped>
	.imas {
		position: absolute;
		height: 40px;
		left: 50%;
		transform: translate(-50%);
		bottom: 4px;
		margin-bottom: 1rem;
		object-position: center;
		width: 40px;
	}
</style>